<template>
	<view>
		<view class="u-page">
			<!-- 所有内容的容器 -->
			<course-detail-info-view v-show="current === 0" :template="courseInfo.courseTemplate"></course-detail-info-view>
			<course-detail-process-view v-show="current === 1" :stepList="stepList"></course-detail-process-view>
			<course-detail-annex-view v-show="current === 2"></course-detail-annex-view>
			<course-detail-schedule-view v-show="current === 3" :coursePlanId="planId" :category="category"></course-detail-schedule-view>
			<feed v-show="current === 4" :coursePlanId="planId" :isCourse="true" :category="category"></feed>
		</view>
		<!-- 与包裹页面所有内容的元素u-page同级，且在它的下方 -->
		<u-tabbar v-model="current" :list="list"></u-tabbar>
	</view>
</template>

<script>
	import { getPlanDetail } from '../../api/course.js'
	import CourseDetailInfoView from './course-detail-info-view'
	import CourseDetailProcessView from './course-detail-process-view.vue'
	import CourseDetailAnnexView from './course-detail-annex-view.vue'
	import CourseDetailScheduleView from './course-detail-schedule-view.vue'
	import Feed from '@/pages/feed/feed.vue'
	export default {
		components: {
			CourseDetailInfoView,
			CourseDetailProcessView,
			CourseDetailAnnexView,
			CourseDetailScheduleView,
			Feed
		},
		data() {
			return {
				planId: '',
				category: '',
				
				list: [],
				page: [],
				current: 4,
				
				courseInfo: {},
				stepList: [],
			}
		},
		onLoad(options) {
			console.log(options);
			this.planId = options.planId;
			this.category = options.category;
			this.courseStatus = options.courseStatus;
			this.templateType = options.templateType;
			this.init();
		},
		methods: {
			init() {
				if (this.templateType === 1 + '') {
					this.list.push(this.getTabItem('photo', 'photo-fill', '基本信息'));
					this.list.push(this.getTabItem('photo', 'photo-fill', '操作流程'));
					this.list.push(this.getTabItem('photo', 'photo-fill', '附件'));
					this.list.push(this.getTabItem('photo', 'photo-fill', '宝宝观测'));
					this.list.push(this.getTabItem('photo', 'photo-fill', '课程动态'));
					this.getCourseDetail();
				}
			},
			
			getCourseDetail() {
				getPlanDetail(this.planId).then(res => {
					console.log(res);
					this.courseInfo = res.data;
					this.stepList = JSON.parse(this.courseInfo.courseTemplate.linkItems);
				})
			},
			
			getTabItem(iconPath, selectedIconPath, text) {
				return {
					iconPath: iconPath,
					selectedIconPath: selectedIconPath,
					text: text,
				}
			}
		}
	}
</script>

<style>

</style>
